<style>
    .layui-form-label {
        width: 115px;
    }
    .ns-calendar{background: url("https://v4.niuteam.cn/public/static/img/ns_calendar.png") no-repeat center / 16px 16px;}
    .layui-logo{height: 100%;display: flex;align-items: center;}
    .layui-logo a{display: flex;justify-content: center;align-items: center;width: 200px;height: 50px;}
    .layui-logo a img{max-height: 100%;max-width: 100%;}
    .goods-preview .qrcode-wrap {max-width: 130px; max-height: 130px; overflow: hidden;}
    .goods-preview .qrcode-wrap input {margin-top: 30px;}
    @media only screen and (max-width: 1340px) {
        .layui-nav .layui-nav-item a {
            padding: 0 15px;
        }
        .layui-nav.ns-head-account .layui-nav-item a{
            padding: 0 20px;
        }
    }
    @media only screen and (max-width: 1200px) {
        .layui-nav .layui-nav-item a {
            padding: 0 10px;
        }
        .layui-nav.ns-head-account .layui-nav-item a{
            padding: 0 20px;
        }
    }
    @media only screen and (max-width: 920px) {
        .layui-nav .layui-nav-item a {
            padding: 0 5px;
        }
        .layui-nav.ns-head-account .layui-nav-item a{
            padding: 0 20px;
        }
    }
    @media only screen and (max-width: 1090px) {
        .ns-shop-ewm {
            display: none;
        }
    }
    .style_all{
        display: flex;
        margin: auto;
    }
    .styles{
        width:48%;
        margin-right:4%;
    }
    .styles:nth-child(2){
        margin-right: 0;
    }
    .styles img{width:100%;height:200px;border:2px #ccc solid;box-sizing: border-box;}
    .styles p{text-align: center;margin-top:10px;}
    /* .layui-layer-content{padding-bottom:4px!important;} */
</style>
<style>
    .flex {display:flex;flex-wrap:wrap;}
    .flex .layui-form-item {width:50%}
    .ns-form-row {margin:20px auto;}
    .layui-tab-brief li {border-bottom:3px solid #FFFFFF;}
    .layui-tab-brief li.layui-this, .layui-tab-brief li.layui-this:after{border-bottom:3px solid #6e56ff !important;color: #6e56ff !important;}
    .panel-content {padding-left:15px;box-sizing:border-box;}
    .bw-custom-panel .custom-panel-title .panel-content {width:calc(100% - 190px);}
    .ns-account-value,.bw-split {line-height:34px;}
    .bw-split {width: auto !important;}
    .bw-custom-panel .custom-panel-from {display:flex;}
    .bw-custom-panel .custom-panel-from .layui-form-label {text-align:center;}
    .bw-custom-panel .custom-panel-from>div {text-align:center;}
    .bw-custom-panel .custom-panel-from .layui-form-item>div>span {margin-right:10px;}
    .bw-custom-panel .custom-panel-from .layui-form-item>div>button {width:20px;height:20px;text-align:center;padding:0;line-height:20px;border:0;color:#6e56ff;}
    .layui-input-block + .layui-word-aux {display:block;margin-left:100px;}
    .bw-shop-account {display:flex;align-items:center;position:relative;padding:15px;box-sizing:border-box;}
    .bw-item-pic {width:70px!important;height:70px!important;margin-right:15px;border-radius: 50%;overflow: hidden;}
    .bw-shop-detail {flex:1;}
    .bw-shop-detail p {display:inline-block;width:300px;line-height:30px;}
    .select-level-layer .layui-layer-content {overflow-y:scroll!important;}
    .edit-member-layer .layui-form-radio {margin-top:0;}
    .edit-member-layer .ns-form {padding:0;}
    .edit-member-layer .ns-form .layui-form-item {margin-bottom:0;}
    .bw-member-info {margin-left:15px;background: #f5f5f5}
    .ns-text-color{color: #6e56ff;}
    .layui-tab-title{border-bottom: none;}
    .bw-item-block-parent {
        padding: 20px;
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        background-color: #fff;
        box-sizing: border-box;
        border-radius: 5px;
    }
    .bw-item-block-parent .bw-item-pic img {
        max-width: 100%;
        max-height: 100%;
    }
    .grey{
        color: grey;
    }

    .bw-item-pic{
        cursor: pointer;
    }
</style>
<div class="ns-body-content">
    <!-- 四级导航 -->


    <div class="fourstage-nav layui-tab layui-tab-brief" lay-filter="edit_user_tab">
        <ul class="layui-tab-title">
            <li class="layui-this" lay-id="basic_info">基本信息</li>
        </ul>
    </div>
    <div class="layui-form ns-form flex">
        <div class="layui-card-body bw-item-block-parent bw-member-info">
            <div class="bw-item-pic" onclick="editProfile(this, 'avatar', {$row.id})" title="点击进行头像编辑">
                <img src="{$row.avatar|default=''}" alt="点击进行头像编辑">
            </div>
            <div class="bw-shop-detail">
                <!--<p>-->
                    <!--<strong>用户名：</strong>-->
                    <!--<span class="ns-text-color-dark-gray" id="username">{$row.username|default='暂无'}</span>-->
                <!--</p>-->
                <p>
                    <strong>昵称：</strong>
                    <span class="ns-text-color-dark-gray" id="nickname">{$row.nickname|default=''}</span>
                    <i class="layui-icon ns-text-color" style="margin-left: 5px;" onclick="editProfile(this, 'nickname', {$row.id})"> </i>
                </p>
                <p>
                    <strong>手机号：</strong>
                    <span class="ns-text-color-dark-gray" id="mobile">{$row.mobile|default=''}</span>
                    <i class="layui-icon ns-text-color" style="margin-left: 5px;" onclick="editProfile(this, 'mobile', {$row.id})"> </i>
                </p>
                <p>
                    <strong>注册时间：</strong>
                    <span class="ns-text-color-dark-gray ns-end-time">{$row.create_time|default=''|date='Y-m-d H:i'}</span>
                </p>
                <p>
                    <strong>最后登录时间：</strong>
                    <span class="ns-text-color-dark-gray ns-end-time">{$row.login_time|default=''|date='Y-m-d H:i'}</span>
                </p>

            </div>
        </div>

    </div>


    <div class="fourstage-nav layui-tab layui-tab-brief" lay-filter="edit_user_tab">
        <ul class="layui-tab-title">
            <li class="layui-this" lay-id="basic_info">第三方账号绑定情况</li>
        </ul>
    </div>
    <div class="layui-form ns-form flex">
        <div class="layui-card-body bw-item-block-parent bw-member-info">
            <!--<div class="bw-item-pic">-->
                <!--<img src="{$row.avatar|default=''}" alt="">-->
            <!--</div>-->
            <div class="bw-shop-detail">

                <p>
                    <strong>微信小程序open_id：</strong><br>
                    {if condition="$row.miniapp_uid"}
                    <span class="ns-text-color-dark-gray ns-end-time">{$row.miniapp_uid|default=''}</span>
                    {else /}
                    <span class="ns-text-color-dark-gray ns-end-time grey">未绑定微信小程序</span>
                    {/if}
                    <i class="layui-icon ns-text-color" style="margin-left: 5px;" onclick="editProfile(this, 'miniapp_uid', {$row.id})"> </i>
                </p>

                <p>
                    <strong>微信公众号open_id：</strong><br>
                    {if condition="$row.official_uid"}
                    <span class="ns-text-color-dark-gray ns-end-time">{$row.official_uid|default=''}</span>
                    {else /}
                    <span class="ns-text-color-dark-gray ns-end-time grey">未绑定微信公众号</span>
                    {/if}

                    <i class="layui-icon ns-text-color" style="margin-left: 5px;" onclick="editProfile(this, 'official_uid', {$row.id})"> </i>
                </p>
                <p>
                    <strong>今日头条open_id：</strong><br>

                    {if condition="$row.tt_uid"}
                    <span class="ns-text-color-dark-gray ns-end-time">{$row.tt_uid|default=''}</span>
                    {else /}
                    <span class="ns-text-color-dark-gray ns-end-time grey">未绑定今日头条</span>
                    {/if}
                    <i class="layui-icon ns-text-color" style="margin-left: 5px;" onclick="editProfile(this, 'tt_uid', {$row.id})"> </i>
                </p>

            </div>
        </div>

    </div>

    <div class="fourstage-nav layui-tab layui-tab-brief" lay-filter="edit_user_tab">
        <ul class="layui-tab-title">
            <li class="layui-this" lay-id="basic_info">账户明细</li>
        </ul>
        <div class="layui-tab-content">
            <div class="layui-tab-item layui-show">
                <!-- <iframe src="https://v4.niuteam.cn/shop/member/accountdetail.html?member_id=789" style="width:100%;height:100vh;border:0"></iframe> -->
                <div class="bw-custom-panel">
                    <div class="custom-panel-from ns-form">
                        <div class="layui-form">
                            <div class="layui-form-item">
                                <label class="layui-form-label">余额</label>
                                <div>

                                    <span class="ns-len-short ns-account-value" id="money">{$row.money}</span>
                                    <button class="layui-btn layui-btn-primary layui-icon" onclick="changeMoney(this, 'money', {$row.id})" data-num="0"></button>
                                </div>
                            </div>
                        </div>

                        <div class="layui-form" lay-filter="pointForm">
                            <div class="layui-form-item">
                                <label class="layui-form-label">积分</label>
                                <div>
                                    <span class="ns-len-short ns-account-value" id="integral">{$row.integral}</span>
                                    <button class="layui-btn layui-btn-primary layui-icon" onclick="changeMoney(this, 'integral', {$row.id})" data-num="0"></button>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
                <div class="layuimini-container">
                    <div class="layuimini-main">
                        <table id="detailTable" class="layui-table layui-hide"
                               data-auth-add="0"
                               data-auth-edit="0"
                               data-auth-delete="0"
                               lay-filter="detailTable">
                        </table>
                    </div>
                    <input type="hidden" name="select_name" id="select_name" value='{$getMemberMiniappList|json_encode=###,JSON_UNESCAPED_UNICODE}'>
                    <input type="hidden" name="select_type" id="select_type" value='{$getTypeList|json_encode=###,JSON_UNESCAPED_UNICODE}'>
                    <input type="hidden" name="select_category" id="select_category" value='{$getCategoryList|json_encode=###,JSON_UNESCAPED_UNICODE}'>
                </div>
            </div>
        </div>
    </div>


</div>
<script>
    function editProfile(event, field, id) {
        console.log(field)
        layer.open({
            type: 2,
            title: '编辑',
            area: ['600px', '300px'],
            fixed: false, //不固定
            maxmin: true,
            content: "edit?id="+id+"&field="+field
        });
    }
    function changeMoney(event, field, id) {
        console.log(field)
        layer.open({
            type: 2,
            title: '编辑',
            area: ['600px', '300px'],
            fixed: false, //不固定
            maxmin: true,
            content: "changeMoney?id="+id+"&field="+field
        });
    }
    var detail_id = "{$row.id}";
</script>


<!--收支-->
<script type="text/html" id="pm_templet">
    {{#  if(d.pm == '1'){ }}
    <span style="color: green">获得</span>
    {{#  } else { }}
    <span style="color: red" >支出</span>
    {{#  } }}
</script>
<!--明细数字-->
<script type="text/html" id="number_templet">
    {{#  if(d.pm == '1'){ }}
    <span style="color: green">+{{d.number}}</span>
    {{#  } else { }}
    <span style="color: red" >-{{d.number}}</span>
    {{#  } }}
</script>